<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
  <link rel="stylesheet" href="../css/public.css">
  <link rel="stylesheet" href="../css/goods.css">
  <script src="../js/jquery-1.10.1.min.js"></script>
  <script src="../js/interfdce.js"></script>
  <script src="../js/goodsList.js"></script>
</head>

<body>
  <header class="header"></header>

  <div class="content">
    <div class="banner">
      <nav>
        <div class="navOne">
          <ul>
            <li>
              <h4> <a href="">秋季新品</a></h4>
            </li>

            <li class="navBar">
              <h4 class="OneBtn">女士</h4>
              <div class="listOne">
                <span><a href="">T恤/上衣</a></span>
                <span><a href="">POLO衫</a></span>
                <span><a href="">卫衣</a></span>
                <span><a href="">外套</a></span>
                <span><a href="">裤装</a></span>
                <span><a href="">休闲衫</a></span>
                <span><a href="">运动鞋</a></span>
                <span><a href="">包包附配饰</a></span>
              </div>
            </li>

            <li class="navBar">
              <h4>男士</h4>
              <div class="listOne">
                <span><a href="">T恤/上衣</a></span>
                <span><a href="">POLO衫</a></span>
                <span><a href="">卫衣</a></span>
                <span><a href="">外套</a></span>
                <span><a href="">裤装</a></span>
                <span><a href="">休闲衫</a></span>
                <span><a href="">运动鞋</a></span>
                <span><a href="">包包附配饰</a></span>
              </div>
            </li>
            <li class="navBar">
              <h4>儿童</h4>
              <div class="listOne">
                <span><a href="">男童-服装</a></span>
                <span><a href="">男童-鞋类</a></span>
                <span><a href="">男童-包包附配品</a></span>
                <span><a href="">女童-服装</a></span>
                <span><a href="">女童-鞋类</a></span>
                <span><a href="">女童-包包附配品</a></span>
              </div>
            </li>
            <li>
              <h4 class="fusion">FUSION</h4>
            </li>
          </ul>
        </div>
        <div class="navTwo">
          <ul>
            <li>
              <a href="">帮助中心</a>
            </li>
            <li>
              <a href="">+购物中心</a>
            </li>
            <li>
              <a href="">+关于FILA</a>
            </li>
            <li>
              <a href="">+工作机会</a>
            </li>
          </ul>
        </div>
      </nav>
      <div class="listWrap">
        <div class="list-body">
          <!-- Top-left -->
          <div class="list-body-l fl">
            <div class="cate-title">
              所有商品
              <!-- <span>(1057)</span> -->
            </div>
          </div>
          <!-- Top-right -->
          <div class="list-body-r fr">
            <div class="result-count">匹配结果(1057)</div>
            <div class="selector-open">筛选</div>
            <div class="filter-order">
              <P class="filter-orderBtn dropdown-btn">新品排序</P>
              <ul class="filter-list dropdown-menu">
                <!-- <li class="orderCol"><a href="">新品排序</a></li>
                <li class="orderCol"><a href="">销量排序</a></li> -->
                <li class="orderType"><a href="Javascript:;">价格由低到高</a></li>
                <li class="orderType"><a href="Javascript:;">价格由高到低</a></li>
              </ul>
            </div>
          </div>
          <!-- 商品列表 -->
          <ul class="goods-list">
            <!-- <li class="goods-item">
              <div class="goods-body">
                <a class="goods-pic" href=""><img src="../images/cart-p1.jpg" alt=""></a>
                <a class="goods-name ellipsis" href="">男子潮流时尚连帽卫衣</a>
                <div class="goods-thumbs">
                  <ul class="thumbs-list">
                    <li>
                      <a href=""><img src="../images/cart-p1.jpg" alt=""></a>
                    </li>
                  </ul>
                </div>
                <a href="" class="goods-price"><span>￥880</span></a>
              </div>
            </li> -->
          </ul>
          <div class="list-bottom fr">
            <div class="listPage">
              <div class="page-select">
                <a href="" class="page-select-btn dropdown-btn">1</a>
                <ul class="page-select-list scroll dropdown-menu">
                  <li>1</li>
                  <li>2</li>
                  <li>3</li>
                </ul>
              </div>
              <span>38/页</span>
              <a href="" class="page-btn page-prev-btn">
              </a>
              <a href="" class="page-btn page-next-btn"></a>
            </div>
          </div>
        </div>
      </div>

    </div>
  </div>



  <header class="footer"></header>

</body>

<script>
  $(".header").load("header.html");
  $(".footer").load("footer.html");


  $(".navBar").click(function () {
    // console.log(111);
    $(this).find(".listOne").show().end().siblings().find(".listOne").hide();
  })
  $(".listOne span").click(function () {
    console.log(this);
    $(location).attr("href", "../html/goods.html")
  })
</script>


</html>